import React, { Component } from 'react';

export class Hello extends Component {
  render() {
    console.log('props=>', this.props);
    return (
      <div>
        <h1>这是一个类组件</h1>
        <h3>我叫：{this.props.name}</h3>
        <h3>{this.props.age}</h3>
        <div>{this.props.likes.join('==>')}</div>
        <h1>
          {this.props.obj.name}, {this.props.obj.age}
        </h1>
        <div>{this.props.fn()}</div>
        <div>{this.props.jsx}</div>
      </div>
    );
  }
}

export const Hello2 = (props) => {
  // props.obj.age = 20;
  return (
    <div>
      <h1>这是一个函数组件</h1>
      <h3>我叫：{props.name}</h3>
      <h3>{props.age}</h3>
      <div>{props.likes.join('==>')}</div>
      <h1>
        {props.obj.name}, {props.obj.age}
      </h1>
      <div>{props.fn()}</div>
      <div>{props.jsx}</div>
    </div>
  );
};
